{layout name="layout/header" /}
<link href="root/css/plugins/footable/footable.core.css" rel="stylesheet">
<link href="root/css/plugins/iCheck/custom.css" rel="stylesheet">

<link href="root/css/plugins/switchery/switchery.css" rel="stylesheet">
<script src="root/js/plugins/switchery/switchery.js"></script>
<!--<link href="root/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">-->
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>活动列表</h5>
                </div>
                <div class="ibox-content">
                    <p>
                        <a type="button" class="btn btn-outline btn-success" href="{:url('add')}">新增</a>
                        <button type="button" class="btn btn-danger btn-outline" id="empty_redis">清除缓存</button>
                        <button type="button" class="btn btn-primary btn-outline refresh">刷新</button>
                    </p>
                    <form class="form-inline">
                        <div class="form-group">
                            <input type="text" id="keyword" class="form-control" placeholder="输入名称" value="{$keyword}">
                        </div>
                        <a class="btn btn-success" id="search" href="#">查询</a>
                    </form>
                </div>
                <div class="ibox-content">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>活动名称</th>
                                <th>开始时间</th>
                                <th>截止时间</th>
                                <th>限制类型</th>
                                <th>抽奖数量</th>
                                <!--<th>限制IP</th>-->
                                <!--<th>IP投票数量</th>-->
                                <!--<th>限制设备</th>-->
                                <!--<th>设备抽奖数量</th>-->
                                <th>状态</th>
                                <th>备注</th>
                                <th>创建时间</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                        {volist name="data.new" id="vo"}
                        <tr pid="{$vo.id}" >
                            <td>{$vo.id}</td>
                            <td style="max-width: 500px; overflow: hidden">{$vo.name}</td>
                            <td>{$vo.start|date="Y-m-d H:i",###}</td>
                            <td>{$vo.end|date="Y-m-d H:i",###}</td>
                            <td>
                                {switch name="$vo.lottery_type"}
                                {case value="1"}每天{/case}
                                {case value="2"}总数{/case}
                                {/switch}
                            </td>
                            <td>{$vo.nums}</td>
                            <!--<td>-->
                                <!--{if condition="$vo.is_ip"}-->
                                <!--<span class="text-success">是</span>-->
                                <!--{else/}-->
                                <!--<span class="text-danger">否</span>-->
                                <!--{/if}-->
                            <!--</td>-->
                            <!--<td>{$vo.ip_nums}</td>-->
                            <!--<td>-->
                                <!--{if condition="$vo.is_device"}-->
                                <!--<span class="text-success">是</span>-->
                                <!--{else/}-->
                                <!--<span class="text-danger">否</span>-->
                                <!--{/if}-->
                            <!--</td>-->
                            <!--<td>{$vo.device_nums}</td>-->
                            <td>
                                {switch name="$vo.enable"}
                                {case value="1"}<span class="text-success">正常</span>{/case}
                                {case value="0"}<span class="text-danger">禁用</span>{/case}
                                {/switch}
                            </td>

                            <td style="max-width: 500px; overflow: hidden">{$vo.remark}</td>
                            <td>{$vo.addtime|date="Y-m-d H:i",###}</td>
                            <td>
                                <a type="button" class="btn btn-info btn-sm " href="{:url('update',['id'=>$vo.id])}">编辑</a>
                                <a type="button" onclick="copyToClipboard('{$vo.link_url}')" class="btn btn-info  btn-sm">点击复制活动地址</a>
                                <a type="button" class="btn btn-primary btn-sm " href="{:url('lotteryPrize/index',['lottery_id'=>$vo.id])}">奖品设置</a>
                                <a type="button" class="btn btn-primary btn-sm " href="{:url('lotteryData/index',['lottery_id'=>$vo.id])}">抽奖记录</a>
                                <a type="button" class="btn btn-warning btn-sm " href="{:url('lotteryData/count',['lottery_id'=>$vo.id])}">抽奖统计</a>
                            </td>
                        </tr>
                        {/volist}
                        </tbody>
                        <tfoot>
                        <tr>
                            <td colspan="5">
                                {$data.page}
                            </td>
                        </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!--layer-->
<script src="root/js/plugins/layer/layer.min.js"></script>
<!-- iCheck -->
<script src="root/js/plugins/iCheck/icheck.min.js"></script>
<script>
    $(document).ready(function() {
        checks();
        //单选，复选按钮
        function checks () {
            $('.i-checks').iCheck({
                checkboxClass: 'icheckbox_square-green',
                radioClass: 'iradio_square-green'
            })
        }
        var elem = document.querySelectorAll('.js-switch');
        elem.forEach(function(i,index){
            var a= "a" +index;
            a = new Switchery(i, {
            color: '#1AB394'
            });
        });
        $("#empty_redis").click(function () {
            layer.confirm('确定清除所有缓存吗？', {
                    btn: ['确定','取消'] //按钮
                }, function(){
                    $.ajax({
                        url:"{:url('ajax_empty_redis')}",
                        type:'get',
                        dataType:'json',
                        success:function (data) {
                            layer.msg(data.msg);
                            if(data.code ==1){
                                $this.parent().parent().remove();
                            }
                        }
                    })
                }, function(){

                });
        })

        //搜索
        $('#search').click(function () {
            var keyword = $("#keyword").val().trim();
            var url = "{:url('index')}"+'/keyword/'+keyword;
            window.location.href = url;
        });
        //列表页修改
        $(".update_checkbox").change(function () {
            var field = $(this).attr('data-field');
            var value = $(this).is(':checked')?1:0;
            var id = $(this).parent().parent().attr('pid');
            update(id,field,value);
        });
        //列表页修改
        $(".update_text").blur(function () {
            var field = $(this).attr('data-field');
            var id = $(this).parent().parent().attr('pid');
            var value = $(this).val().trim();
            update(id,field,value);
        });
        function update(id,field,value) {
            $.ajax({
                url:"{:url('ajax_update')}",
                type:'post',
                dataType:'json',
                data:{field:field,value:value,id:id},
                success:function (data) {
                    console.log(data.message);
                    if(data.code == 0){
                        layer.msg(data.message);
                    }
                }
            })
        }
        //删除
        // $('.del').click(function(){
        //     var id = $(this).attr('pid');
        //     var $this = $(this);
        //
        //     layer.confirm('确定删掉吗？', {
        //         btn: ['确定','取消'] //按钮
        //     }, function(){
        //         $.ajax({
        //             url:"{:url('ajax_del')}",
        //             type:'post',
        //             data:{id:id},
        //             dataType:'json',
        //             success:function (data) {
        //                 layer.msg(data.msg);
        //                 if(data.code ==1){
        //                     $this.parent().parent().remove();
        //                 }
        //             }
        //         })
        //     }, function(){
        //
        //     });
        //
        // });

    });
</script>
<script>
    function copyToClipboard (text) {
        if(text.indexOf('-') !== -1) {
            let arr = text.split('-');
            text = arr[0] + arr[1];
        }
        var textArea = document.createElement("textarea");
        textArea.style.position = 'fixed';
        textArea.style.top = '0';
        textArea.style.left = '0';
        textArea.style.width = '2em';
        textArea.style.height = '2em';
        textArea.style.padding = '0';
        textArea.style.border = 'none';
        textArea.style.outline = 'none';
        textArea.style.boxShadow = 'none';
        textArea.style.background = 'transparent';
        textArea.value = text;
        document.body.appendChild(textArea);
        textArea.select();

        try {
            var successful = document.execCommand('copy');
            var msg = successful ? '成功复制到剪贴板' : '该浏览器不支持点击复制到剪贴板';
            layer.msg(msg);
        } catch (err) {
            layer.msg('该浏览器不支持点击复制到剪贴板');
            // alert('该浏览器不支持点击复制到剪贴板');
        }

        document.body.removeChild(textArea);
    }
</script>